<template>
	<view class="page-content">
		<f-navbar title="签到"></f-navbar>
		<view class="content-main">
			<view class=" flex align-center">
				<view class="content-title">签到拍照</view>
				<view class="title-num">（{{imgs.length}}/3）</view>
			</view>
			<view class="content-main-box">
				<uploadList :num="3" size="186rpx" v-model="imgs"></uploadList>
			</view>
			<view class="tips">
				注:请拍摄现场照片进行签到
			</view>
			<template  v-if="pageData.isDeviation == '1'">
				<view class=" flex align-center" style="margin-top: 30rpx;">
					<view class="content-title">偏离备注</view>
					<view class="title-num">
						
					</view>
				</view>
				<view class="content-main-box" style="padding: 10rpx;">
					<u--textarea
					  v-model="remark"
					  placeholder="请输入您偏离签到的备注"
					  border="none"
					></u--textarea>
				</view>
			</template>
			
			<view class="login-btn">
				<u-button color="linear-gradient(83deg, #48B453 0%, #2C9F79 100%)"
					:customStyle="{width:'635rpx',height:'83rpx',fontSize:'34rpx',borderRadius:'50rpx',fontWeight:'bold'}"
					@click="submitForm">确认签到
				</u-button>
			</view>
		</view>
	</view>
</template>
<script>
	import uploadList from "@/components/upload/list.vue"
	import {
		taskSignIn
	} from "@/api/task.js"
	export default {
		components: {
			uploadList
		},
		data() {
			return {
				pageData: {},
				imgs: [],
				remark:'',
			};
		},
		onPageScroll(e) {

		},
		onReady() {

		},
		onShow() {},
		onLoad(option) {
			this.pageData = option
		},
		onHide() {

		},
		methods: {
			submitForm() {
				console.log('获取的参数',this.pageData);
				if(this.imgs.length==0){
					uni.$u.toast('请拍照签到');
					return false;
				}
				if(this.pageData.isDeviation == '1' && this.remark == ''){
					uni.$u.toast('请输入偏离备注');
					return false;
				}
				
				// 签到接口加个参数 isDeviation 是否偏离0否1是
				taskSignIn({
					...this.pageData,
					signInPhoto:this.imgs.join(","),
					remark:this.remark,
				}).then((res) => {
				uni.$u.toast('签到成功');
					this.goLink('','back')
				})
			}
		},
	};
</script>
<style lang="scss" scoped>
	.page-content {
		.content-main {
			padding: 32rpx;

			.content-title {
				color: #000000;
				font-size: 34rpx;
				font-weight: bold;

				&:before {
					content: "*";
					color: #DF0E0E;
					font-size: 36rpx;
					margin-right: 3rpx;
				}
			}

			.content-main-box {
				margin-top: 20rpx;
				background: #fff;
				border-radius: 16rpx;
				padding: 32rpx;
			}
			.tips{
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 29rpx;
				color: #2E2528;
				margin-top: 25rpx;
			}
			.login-btn {
				margin-top: 88rpx;
			}
		}
	}
</style>